import classnames from 'classnames'
import { useNavigate } from 'react-router-dom'
import { NavBar, SearchBar } from 'antd-mobile'

import Icon from '@/components/Icon'
import styles from './index.module.scss'

const SearchPage = () => {
  const navigate = useNavigate()

  return (
    <div className={styles.root}>
      <NavBar className="navbar" onBack={() => navigate(-1)}>
        <SearchBar placeholder="请输入关键字搜索" />
      </NavBar>

      <div className={classnames('search-result', true ? 'show' : '')}>
        <div className="result-item">
          <Icon type="iconbtn_search" />
          <div className="result-value text-overflow">
            <span>黑马</span>
            程序员
          </div>
        </div>
      </div>
    </div>
  )
}

export default SearchPage
